//引入express
const express = require('express');
//创建应用对象
const app = express();
//创建路由规则
app.get('/server', (request, response) => {
    //设置响应头
    response.setHeader('Access-Control-Allow-Origin', '*')

    //设置响应体
    response.send('Hello AJAX Get')
});
app.post('/server', (request, response) => {
    //设置响应头
    response.setHeader('Access-Control-Allow-Origin', '*')

    //设置响应体
    response.send('Hello AJAX Post')
});
//监听端口启动服务
//访问127.0.0.1:8000/server
app.listen(8000, () => {
    console.log('服务启动')
});


//jsdom解决nodejs没有DOM
const jsdom = require("jsdom");
const { JSDOM } = jsdom;
global.document = new JSDOM('127.0.0.1:8000/server').window.document;

//按钮点击
let button = global.document.getElementById('button');
let result = global.document.getElementById('result');
console.log(button)
button.addEventListener('click', function () {
    const xhr = new XMLHttpRequest();
    xhr.open('GET', 'http://127.0.0.1:8000/server'); //?后面接数据
    xhr.send();
    // 处理服务端返回的结果
    //状态0未初始化 1open 2send 3服务端返回部分结果 4服务端返回所用结果
    //change ‘改变’ 触发四次
    xhr.onreadystatechange = function () {
        //判断服务端是否返回了所有结果
        if (xhr.readyState === 4) {
            //判断响应状态码 200 404 403 401 500
            if (xhr.status >= 200 && xhr.status < 300) {
                //处理结果
                // 响应行
                //状态码
                console.log(xhr.status);
                //状态字符串
                console.log(xhr.statusText);
                //所有响应头
                console.log(xhr.getAllResponseHeaders());
                //响应体
                console.log(xhr.response)
                //设置页面文本
                result.innerHTML = xhr.response;
            }
        }
    }
})



